@use "../../default" as theme;
@use "../../Icon/style/default" as Icon;
.pf-Input{
	@include theme.input-widget-wrap(
		$-height:theme.$Input-height,
		$-active-color:theme.$Input-primary-color,
		$-border-color:theme.$Input-border-color,
		$-disabled-color:theme.$Input-disabled-color,
		$-disabled-opacity:theme.$Input-disabled-opacity,
		$-radius:theme.$Input-radius,
		$-round-padding:theme.$Input-round-padding,
		$-transition:theme.$Input-transition,
		$-shadow:theme.$Input-shadow,
		$-real:pf-Input_input,
		$-vertical-align:theme.$vertical-align,
	);
	&.pf--disabled{
		>.pf-Input_icon{
			cursor:not-allowed;
		}
	}
}
@include theme.input-widget(
	$-prefix:pf-Input,
	$-font-size:theme.$Input-content-size,
	$-padding:0 theme.$Input-gap,
	$-color:theme.$Input-color,
	$-hint-color:theme.$Input-hint-color,
	$-disabled-opacity:theme.$Input-disabled-opacity,
);
.pf-Icon{
	&.pf-Input_clear,&.pf-Input_password,&.pf-Input_icon{
		flex-shrink:0;
		font-size: theme.$Input-icon-size;
		color: theme.$Input-icon-color;
	}
	&.pf-Input_icon{
		&.pf--prefix{
			margin-left: theme.$Input-gap;
		}
		&.pf--suffix{
			margin-right: theme.$Input-gap;
		}
	}
	&.pf-Input_clear,&.pf-Input_password{
		margin-right: theme.$Input-gap;
		cursor:pointer;
	}
}